import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:smart_devices/icons/flutter_icons.dart';
import 'package:smart_devices/ui/draw_under_line.dart';
import 'package:smart_devices/utils/colors.dart';
import 'package:smart_devices/utils/styles.dart';
import 'package:smart_devices/utils/tools.dart';

class SpareController extends GetxController {
  RxInt total = RxInt(5);

  RxInt all = RxInt(500);

  @override
  void onClose() {
    super.onClose();
    Get.delete();
  }
}

class SparePage extends GetView<SpareController> {
  const SparePage({super.key});

  @override
  Widget build(BuildContext context) {
    return GetBuilder<SpareController>(
      builder: (_) {
        return Scaffold(
          backgroundColor: ColorsUtils.parseColorFromHexString(ColorsUtils.colorF6f6),
          appBar: AppBar(
            automaticallyImplyLeading: false,
            title: Text(
              '备件',
              style: StylesUtils.customTextStyle(fontSize: 16, fontWeight: FontWeight.w700),
            ),
            centerTitle: true,
            backgroundColor: ColorsUtils.parseColorFromHexString(ColorsUtils.color0052),
          ),
          body: SingleChildScrollView(
            child: Column(
              children: [
                Container(
                  padding: const EdgeInsets.all(10),
                  decoration: const BoxDecoration(color: Colors.white),
                  child: GridView.custom(
                    gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
                        crossAxisCount: 2, crossAxisSpacing: 20, childAspectRatio: 1.63),
                    shrinkWrap: true,
                    physics: const NeverScrollableScrollPhysics(),
                    childrenDelegate: SliverChildListDelegate([
                      Container(
                        width: 175,
                        height: 100,
                        alignment: Alignment.center,
                        padding: const EdgeInsets.symmetric(vertical: 20),
                        decoration: BoxDecoration(
                            color: ColorsUtils.parseColorFromHexString(ColorsUtils.colorE2ea),
                            borderRadius: BorderRadius.circular(5)),
                        child: Column(
                          children: [
                            Container(
                              height: 30,
                              alignment: Alignment.center,
                              child: Obx(() => Text(
                                    '${controller.total.value}',
                                    style: StylesUtils.customTextStyle(
                                        fontSize: 20, color: ColorsUtils.color9999),
                                  )),
                            ),
                            Container(
                              height: 30,
                              alignment: Alignment.center,
                              child: Text(
                                '库存不足',
                                style: StylesUtils.customTextStyle(color: ColorsUtils.color9999),
                              ),
                            )
                          ],
                        ),
                      ),
                      Container(
                        width: 175,
                        height: 100,
                        alignment: Alignment.center,
                        padding: const EdgeInsets.symmetric(vertical: 20),
                        decoration: BoxDecoration(
                            color: ColorsUtils.parseColorFromHexString(ColorsUtils.colorE2ea),
                            borderRadius: BorderRadius.circular(5)),
                        child: Column(
                          children: [
                            Container(
                              height: 30,
                              alignment: Alignment.center,
                              child: Obx(() => Text(
                                    '${controller.all.value}',
                                    style: StylesUtils.customTextStyle(
                                        fontSize: 14, color: ColorsUtils.color9999),
                                  )),
                            ),
                            Container(
                              height: 30,
                              alignment: Alignment.center,
                              child: Text(
                                '库存过量',
                                style: StylesUtils.customTextStyle(color: ColorsUtils.color9999),
                              ),
                            )
                          ],
                        ),
                      ),
                    ]),
                  ),
                ),
                Container(
                  decoration: const BoxDecoration(color: Colors.white),
                  padding: const EdgeInsets.only(left: 10, right: 10),
                  child: ListBody(
                    children: [
                      DrawUnderLine(
                          child: Container(
                        height: 50,
                        alignment: Alignment.centerLeft,
                        child: Row(
                          mainAxisAlignment: MainAxisAlignment.spaceBetween,
                          children: [
                            Wrap(
                              spacing: 5,
                              children: [
                                Container(
                                  constraints: BoxConstraints.tight(const Size.square(50)),
                                  alignment: Alignment.center,
                                  child:
                                      ToolsUtils.assetImageSvg('u58414.svg', width: 20, height: 20),
                                ),
                                Container(
                                  alignment: Alignment.centerLeft,
                                  height: 50,
                                  child: Text(
                                    '备件档案',
                                    style:
                                        StylesUtils.customTextStyle(color: ColorsUtils.color3333),
                                  ),
                                )
                              ],
                            ),
                            InkWell(
                              onTap: () {},
                              child: Container(
                                constraints: BoxConstraints.tight(const Size.square(50)),
                                alignment: Alignment.center,
                                child: Icon(
                                  AntDesign.right,
                                  color: ColorsUtils.parseColorFromHexString(
                                    ColorsUtils.color9999,
                                  ),
                                  size: 15,
                                ),
                              ),
                            )
                          ],
                        ),
                      )),
                      DrawUnderLine(
                          child: Container(
                        height: 50,
                        alignment: Alignment.centerLeft,
                        child: Row(
                          mainAxisAlignment: MainAxisAlignment.spaceBetween,
                          children: [
                            Wrap(
                              spacing: 5,
                              children: [
                                Container(
                                  constraints: BoxConstraints.tight(const Size.square(50)),
                                  alignment: Alignment.center,
                                  child:
                                      ToolsUtils.assetImageSvg('u58420.svg', width: 20, height: 20),
                                ),
                                Container(
                                  alignment: Alignment.centerLeft,
                                  height: 50,
                                  child: Text(
                                    '备件领用',
                                    style:
                                        StylesUtils.customTextStyle(color: ColorsUtils.color3333),
                                  ),
                                )
                              ],
                            ),
                            InkWell(
                              onTap: () {},
                              child: Container(
                                constraints: BoxConstraints.tight(const Size.square(50)),
                                alignment: Alignment.center,
                                child: Icon(
                                  AntDesign.right,
                                  color: ColorsUtils.parseColorFromHexString(
                                    ColorsUtils.color9999,
                                  ),
                                  size: 15,
                                ),
                              ),
                            )
                          ],
                        ),
                      )),
                      DrawUnderLine(
                          child: Container(
                        height: 50,
                        alignment: Alignment.centerLeft,
                        child: Row(
                          mainAxisAlignment: MainAxisAlignment.spaceBetween,
                          children: [
                            Wrap(
                              spacing: 5,
                              children: [
                                Container(
                                  constraints: BoxConstraints.tight(const Size.square(50)),
                                  alignment: Alignment.center,
                                  child:
                                      ToolsUtils.assetImageSvg('u58435.svg', width: 20, height: 20),
                                ),
                                Container(
                                  height: 50,
                                  alignment: Alignment.centerLeft,
                                  child: Text(
                                    '备件出库',
                                    style:
                                        StylesUtils.customTextStyle(color: ColorsUtils.color3333),
                                  ),
                                )
                              ],
                            ),
                            InkWell(
                              onTap: () {},
                              child: Container(
                                constraints: BoxConstraints.tight(const Size.square(50)),
                                alignment: Alignment.center,
                                child: Icon(
                                  AntDesign.right,
                                  color: ColorsUtils.parseColorFromHexString(
                                    ColorsUtils.color9999,
                                  ),
                                  size: 15,
                                ),
                              ),
                            )
                          ],
                        ),
                      )),
                      Container(
                        height: 50,
                        alignment: Alignment.centerLeft,
                        child: Row(
                          mainAxisAlignment: MainAxisAlignment.spaceBetween,
                          children: [
                            Wrap(
                              spacing: 5,
                              children: [
                                Container(
                                  constraints: BoxConstraints.tight(const Size.square(50)),
                                  alignment: Alignment.center,
                                  child:
                                      ToolsUtils.assetImageSvg('u58440.svg', width: 20, height: 20),
                                ),
                                Container(
                                  height: 50,
                                  alignment: Alignment.centerLeft,
                                  child: Text(
                                    '备件入库',
                                    style:
                                        StylesUtils.customTextStyle(color: ColorsUtils.color3333),
                                  ),
                                )
                              ],
                            ),
                            InkWell(
                              onTap: () {},
                              child: Container(
                                constraints: BoxConstraints.tight(const Size.square(50)),
                                alignment: Alignment.center,
                                child: Icon(
                                  AntDesign.right,
                                  color: ColorsUtils.parseColorFromHexString(
                                    ColorsUtils.color9999,
                                  ),
                                  size: 15,
                                ),
                              ),
                            )
                          ],
                        ),
                      )
                    ],
                  ),
                )
              ],
            ),
          ),
        );
      },
      init: Get.put(SpareController()),
    );
  }
}
